<template>
  <el-dialog
    :visible.sync="visible"
    v-dialogDrag
    title="人员选择"
    :close-on-click-modal="false"
    class="tl-dialog"
    width="500px"
    :append-to-body="true"
    :modal-append-to-body="true"
    @open="open"
    @close="close"
  >
    <el-form class="tl-form" ref="form" :model="model" size="small" label-width="90px">
      <el-form-item label="邀请人员">
        <tl-ref-user
          v-model="model.usercodes"
          :initDisplayData.sync="model.usernames"
          dataType="code"
          :singleSelect="false"
          :externalQueryParam="{ qry_whereSql: 'EXTENDFIELD1 IS NOT NULL AND ENABLED = 1', qry_nodimission: '0' }"
        ></tl-ref-user>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="cancel">取消</el-button>
      <el-button type="primary" @click="confirm">确认</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: "TlSingleUserRef",
  mixins: [],
  components: {},
  data() {
    return {
      model: {
        usercodes: "",
        usernames: ""
      },
      visible: false
    }
  },
  methods: {
    open() {
      this.model = {
        usercodes: "",
        usernames: ""
      }
    },
    cancel() {
      this.visible = false
    },
    confirm() {
      this.$emit("confirm", this.model)
      this.visible = false
    },
    close() {
      this.visible = false
    }
  }
}
</script>

<style lang="scss" scoped></style>
